@charset "utf-8";

html,
body { background: #020202 url("../img/bg.jpg") 50% 0 no-repeat; color: #68727b; font: normal 13px/1.25 "Trebuchet MS", Arial, sans-serif; margin: 0; padding: 0; }

a { color:#0072a3; text-decoration: none; }
a:hover,
a:focus { color: #00c0ff; }
img { border: 0; }

h2 { font-size: 28px; color: #8c99a5; margin: 0 0 15px 0; padding: 0; letter-spacing: -1px; }
h3 { font-size: 18px; margin: 0 0 15px 0; padding: 0; font-weight: normal; letter-spacing: -1px; }

.green { color: #0e7800; }

/* classes */
.clear { clear: both; display: block; }
.ui-cancel { border-left: 1px solid #232628; padding: 0; margin-left: 10px; }
.ui-cancel span { padding: 0 15px; }

/* buttons */
.button1 span { background-image: url("../img/buttons/default.png"); background-repeat: no-repeat; color: #fff; }
.button1.hover span,
.button1:hover span,
.button1.disabled span,
.button1.processing span { color: #fff; }
.landing .button1.disabled,
.landing .button1.disabled span { color: #484a4d; }

/* form */
.input { background: #fff url("../img/form/input-bg.gif") repeat-x; font-family: "Lucida Sans Unicode", "Lucida Grande", "Arial", sans-serif; /*color: #afafaf;*/ color: #000; padding: 7px; font-size: 14px; border: 1px solid #c0c0c0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.input:hover { background: #fff; }
.input:focus { background: #fff; border-color: #175e7c; color: #000; }
.input.disabled, .input[disabled="disabled"] { background: #e3e3e3; color: #b6b6b6; border-color: #c0c0c0; }
.label { color: #68727b; display: block; padding-bottom: 2px; font-size: 11px; text-transform: uppercase; }

.progress-container { background-color:#202126; border:1px solid #4a4f53; width:100%; height:6px; margin-top:40px; }
.progress-interior { background-color:#6eaa62; width:100%; height:6px; }
.progress-note { margin-bottom:40px; margin-top:4px;}

.info-boxes2 .info-box { width: 48%; float: left; margin-right: 2%; }
.info-boxes2 .info-box.last-box { width: 50%; margin-right: 0; }
.info-box .info-label { color: #8c99a5; font-size: 20px; letter-spacing: -0.04em; font-weight: bold; line-height: 1.25; margin: 0 0 .25em 0; }
.info-box .info-data { line-height: 1.5; font-weight: bold; letter-spacing: -.04em; color: #fff; font-size: 30px; padding-left:50px; background:url("../img/phone_bnet.png") 0% 50% no-repeat;}
.info-box .info-data-enter { line-height: 1.5; font-weight: bold; letter-spacing: -.04em; color: #fff; font-size: 30px; padding-left:50px; background:url("../img/enter_bnet.png") 0% 50% no-repeat;}
.info-box .info-data-enter span {color:#4d7d44;}
.info-box .info-data-enter .additional-code {color:#FFFFFF; font-size:20px; }
.info-box .info-data.info-important { background: #4d7d44; }

/* layout */
#wrapper { width: 1000px; margin: 0 auto; padding: 25px 0; }
#left, #right { float: left; }
#content { padding-bottom: 50px; }

.login #left,
.login #right { width: 370px; padding: 0 60px; }
.login #right ul { padding:0 20px }
.authenticator #left { width: 350px; padding: 0 75px; }
.authenticator #right { width: 500px; padding: 0; }
.phone-secure #left { width: 350px; padding: 0 75px; }
.phone-secure #right { width: 500px; padding: 0; }

#logo { height: 92px; text-indent: -9999px; margin: 0 0 25px 0; padding: 0; }
#logo a { display: block; margin: 0 auto; width: 402px; height: 92px; background: url("../local-common/images/logos/bnet-default.png") 0 0 no-repeat; }

/* misc */
#help-links { list-style: none; margin: 0; padding: 0; }
#help-links li { padding: 2px 0 0 20px; margin-bottom: 7px; background: url("../img/icons.gif") 0 0 no-repeat; }
#help-links li.icon-pass { background-position: 2px 3px; }
#help-links li.icon-signup { background-position: 0 -37px; }
#help-links li.icon-secure { background-position: 0 -77px; }
#help-links li.icon-sync { background-position: 2px 3px; }
#help-links li.icon-close { background-position: 0 -77px; }
#help-links li.icon-down { background-position: 0 -117px}
#help-links li.icon-sc2buy { background-position: 0 -167px}

/* form */
#form p { margin: 0 0 20px 0; }
#form .input { width: 95%; }
#remember-me { float: right; display: block; vertical-align: middle; }
#remember-me:hover { color: #8c99a5; }

/* embedded */
#embedded-login { padding: 20px; position: relative; }
#embedded-login h1 { margin: 0 0 20px 0; padding: 0; text-indent: -9999px; height: 65px; background: url("../../../local-common/images/logos/bnet-small.png") -10px 0 no-repeat; }
#embedded-login p { margin: 0 0 20px 0; }
#embedded-login .input { width: 343px; }
#embedded-close { width: 10px; height: 10px; position: absolute; top: 10px; right: 10px; background: url("../img/close.gif") 0 0 no-repeat; }
#ssl-trigger { float:right; padding: 2px 0 0 20px; background: url("../img/icons.gif") no-repeat; background-position: 0 -77px; cursor:pointer; clear:both; position:relative; bottom:23px;}
#ssl-trigger:hover {color:#8C99A5}
#thawteseal { height:50px; padding-top:5px; display:none; clear:both; }

/* errors */
#errors { color: #c4bdb0; background: #530901 url("../img/form/alert-error.png") 0 0 repeat-x; padding: 10px; margin-bottom: 20px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: #000 0 0 5px }
#errors ul { list-style: none; margin: 0; min-height: 30px;  padding-left: 40px; background: url("../../../local-common/images/icons/error.png") 3px 3px no-repeat; }
#content #errors { width: 500px; margin: 0 auto 20px auto; }

/* auth */
#authenticator { padding-left: 200px; background: url("../img/authenticator.gif") no-repeat; font-size: 14px; min-height: 250px; }
#authenticator strong { color: #8c99a5; font-size: 16px; }
#authenticator p { margin: 0 0 15px 0; }

#phone-secure { padding-left: 200px; background: url("../img/phone-secure.gif") no-repeat 40px 0; font-size: 14px; min-height: 250px; }
#phone-secure strong { color: #8c99a5; font-size: 16px; }
#phone-secure p { margin: 0 0 15px 0; }

/* legal */
.legal-document { margin: 15px 0; color: #b9c2cb; background: #2b3035; height: 500px; overflow: auto; padding: 25px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
.legal-document p { line-height: 200%; margin: 15px 0; }
.legal-document strong { color: #fff; }
.legal-accept { color: #009bd0; font-size: 16px; margin-bottom: 25px; display: block; text-align: center; }
.legal-accept.unaccepted { color: #68727B; }
.legal-accept.accepted { color: #cdd8e2; }
.legal-buttons { text-align: center; }
.must-scroll { text-align: center; text-transform: uppercase; margin-bottom: 25px; }

/* matrix */
#matrix-panel { width: 350px; margin: 0 auto; height: 300px; padding-top: 50px; position: relative; }
#matrix-panel .matrix-input { width: 75px; margin: 15px auto; text-align: center; }
#matrix-panel .matrix-input input { width: 50px; text-align: center; }
#matrix-panel .matrix-input label { color: #fff; }
#matrix-panel .ui-button { position: absolute; top: 0; left: 0; }
#matrix-panel .ui-button span span { width: 8px; font-weight: bold; }
#matrix-panel #matrix-number-9 { left: 143px; top: 0; }
#matrix-panel #matrix-number-0 { left: 230px; top: 40px; }
#matrix-panel #matrix-number-1 { left: 275px; top: 105px; }
#matrix-panel #matrix-number-2 { left: 275px; top: 170px; }
#matrix-panel #matrix-number-3 { left: 230px; top: 240px; }
#matrix-panel #matrix-number-4 { left: 143px; top: 280px; }
#matrix-panel #matrix-number-5 { left: 55px; top: 240px; }
#matrix-panel #matrix-number-6 { left: 10px; top: 170px; }
#matrix-panel #matrix-number-7 { left: 10px; top: 105px; }
#matrix-panel #matrix-number-8 { left: 55px; top: 40px; }
#matrix-codes { color: #fff; }
.netease-matrix input { width: 90px; text-align: center; }
